<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 1,在data声明的变量，函数等都可以
2，常量都可以
3，只要是合法的javascript表达式都可以
4，模板字符串都放在沙盒中，只能访问一个白名单，如Math 和Data 等 -->
    <div id="app">
        <h1>{{msg}}</h1>
        <h1>{{msg.split('').reverse().join('')}}</h1>
        <h1>{{sayH()}}</h1>
        <h1>{{num + 1}}</h1>
        <h1>{{'num' + 1}}</h1>
        <h1>{{1 +1}}</h1>
        <h1>{{Date.now()}}</h1>
    </div>
    <script src="./js/vue.js"></script>
    <script>
        new Vue({
            el: '#app',
            data: {
                msg: 'cyh',
                sayH: function () {
                    console.log('hello');
                },
                num: 1,
            }
        })
    </script>
</body>

</html>